<template>
	<view class="page">
		<fu-custom :isBack="true" :isBottom="true" bgColor="bg-white">
			<view slot="content">修改密码</view>
		</fu-custom>
		<view class="per">
			<!-- 旧密码验证修改 start -->
			<view class="per_row_box" @tap="handleJump" data-url="/pages/index/setting/change-password/index">
				<view class="per_row solid-bottom">
					<text class="text-lg text-black">旧密码验证修改</text>
					<text class="fu-iconfont text-bf">&#xe839;</text>
				</view>
			</view>
			<!-- 旧密码验证修改 end -->
			<!-- 手机号码验证修改 start -->
			<view class="per_row_box" @click="handleRoute">
				<view class="per_row">
					<text class="text-lg text-black">手机号码验证修改</text>
					<text class="fu-iconfont text-bf">&#xe839;</text>
				</view>
			</view>
			<!-- 手机号码验证修改 end -->
		</view>

		<!-- 断网监测 start -->
		<fu-notwork></fu-notwork>
		<!-- 断网监测 end -->
	</view>
</template>

<script>
	export default {
		data() {
			return {};
		},
		computed: {

		},
		onShow() {

		},
		onLoad() {

		},
		methods: {
			handleRoute() {
				this.$urouter.navigateTo({
					url: '/pages/index/setting/modify-password-verify-phone/index',
					params: {
						type: 2,
					}
				});
			},

		}
	};
</script>

<style lang="scss" scoped>
	.page {
		background-color: #F8F8F8;
		height: 100vh;
	}

	// 列表样式 start
	.per {
		padding-bottom: 160rpx;
		font-size: 28upx;

		.per_row_box {
			padding: 0 32rpx;
			background-color: #fff;
		}

		.per_row {
			padding: 30upx 0;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			// border-bottom: 1px solid #ededed;
			background-color: #fff;

			text {
				&:nth-child(1) {
					width: 100%;

					text {
						width: auto;
						margin-right: 10upx;
						color: #999;
						float: right;
						line-height: 36upx;
					}
				}
			}

			.row_right {
				text-align: right;

				.aa {
					color: #999999;
					display: inline-block;
					margin-right: 10upx;
				}
			}
		}
	}

	// 列表样式 end

	.fu-iconfont {
		font-size: 24rpx;
	}
</style>
